<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>

        <style>
            body {
                background-size:cover;
                background-image: url("/image/02.png");
            }
        </style>

        <meta charset="UTF-8">
        <title>充值卡业务</title>
        <link href='<c:url context="${pageContext.request.contextPath}" value="/easyui/themes/default/easyui.css"/>'
              rel="stylesheet" type="text/css"/>
        <link href='<c:url context="${pageContext.request.contextPath}" value="/easyui/themes/icon.css"/>' rel="stylesheet"
              type="text/css"/>
        <link href='<c:url context="${pageContext.request.contextPath}" value="/easyui/css/demo.css"/>' rel="stylesheet"
              type="text/css"/>
        <script type="text/javascript"
                src='<c:url value="/easyui/jquery.min.js" context="${pageContext.request.contextPath}"/>'></script>
        <script type="text/javascript"
                src='<c:url value="/easyui/jquery.easyui.min.js" context="${pageContext.request.contextPath}"/>'></script>
        <script type="text/javascript"
                src='<c:url value="/easyui/js/validateExtends.js" context="${pageContext.request.contextPath}"/>'></script>
        <script type="text/javascript"
                src='<c:url value="/easyui/js/easyui-lang-zh_CN.js" context="${pageContext.request.contextPath}"/>'></script>

        <script type="text/javascript">
            $(function () {


                //设置工具类按钮
                $("#add").click(function () {
                    //弹一个对话框
                    $("#addDialog").dialog("open");
                });

                //设置工具类按钮
                $("#add1").click(function () {
                    //弹一个对话框
                    $("#addDialog1").dialog("open");
                });


                //设置添加窗口
                //添加课程的对话框
                $("#addDialog").dialog({
                    title: "号主充值",
                    width: 450,
                    height: 250,
                    iconCls: "icon-add",
                    modal: true,//是否是一个模态对话框
                    collapsible: false,//是否可折叠
                    minimizable: false,//是否可以最小化
                    maximizable: false,//是否可以最大化
                    draggable: true,//是否可以拖拽
                    closed: true,//是否可以关闭
                    buttons: [
                        {
                            text: '充值点击',
                            plain: true,
                            iconCls: 'icon-book-add',
                            handler: function () {
                                var validate = $("#addForm").form("validate");
                                if (!validate) {
                                    $.messager.alert("消息提醒", "请检查你输入的数据!", "warning");
                                    return;
                                } else {
                                    let data = $("#addForm").serialize();// courseName=xxx
                                    $.ajax({
                                        type: "post",
                                        url: "/MSOS/prepaidRecharge",
                                        data: data,
                                        success: function (msg) {
                                            if (msg.status == 200) {
                                                $.messager.alert("消息提醒", msg.msg, "info");
                                                //关闭窗口
                                                $("#addDialog").dialog("close");
                                                //清空原表格数据
                                                $("#add_name").textbox('setValue', "");
                                                //刷新表格
                                                $('#dataList').datagrid("reload");
                                            } else {
                                                $.messager.alert("消息提醒", msg.msg, "warning");
                                                return;
                                            }
                                        }
                                    });
                                }
                            }
                        },
                        {
                            text: '重置',
                            plain: true,
                            iconCls: 'icon-book-reset',
                            handler: function () {
                                $("#add_name").textbox('setValue', "");
                            }
                        },
                    ]
                });

                <!-- ================================================================================ -->

                $("#addDialog1").dialog({
                    title: "帮人充值",
                    width: 450,
                    height: 250,
                    iconCls: "icon-add",
                    modal: true,//是否是一个模态对话框
                    collapsible: false,//是否可折叠
                    minimizable: false,//是否可以最小化
                    maximizable: false,//是否可以最大化
                    draggable: true,//是否可以拖拽
                    closed: true,//是否可以关闭
                    buttons: [
                        {
                            text: '充值点击',
                            plain: true,
                            iconCls: 'icon-book-add',
                            handler: function () {
                                var validate = $("#addForm1").form("validate");
                                if (!validate) {
                                    $.messager.alert("消息提醒", "请检查你输入的数据!", "warning");
                                    return;
                                } else {
                                    let data = $("#addForm1").serialize();// courseName=xxx
                                    $.ajax({
                                        type: "post",
                                        url: "/MSOS/prepaidRecharge",
                                        data: data,
                                        success: function (msg) {
                                            if (msg.status == 200) {
                                                $.messager.alert("消息提醒", msg.msg, "info");
                                                //关闭窗口
                                                $("#addDialog").dialog("close");
                                                //清空原表格数据
                                                $("#add_name1").textbox('setValue', "");
                                                //刷新表格
                                                $('#dataList').datagrid("reload");
                                            } else {
                                                $.messager.alert("消息提醒", msg.msg, "warning");
                                                return;
                                            }
                                        }
                                    });
                                }
                            }
                        },
                        {
                            text: '重置',
                            plain: true,
                            iconCls: 'icon-book-reset',
                            handler: function () {
                                $("#add_name1").textbox('setValue', "");
                            }
                        },
                    ]
                });

            });
        </script>
    </head>
    <body>
        <!-- 数据列表 ，这个就是课程列表的表格-->
        <table id="dataList" cellspacing="0" cellpadding="0">

        </table>
        <!-- 工具栏 -->
        <div id="toolbar">
            <div style="float: left;">
                <a id="add" href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">个人充值</a>
            </div>
            <div style="float: left;" ></div>
            <div>
                <a id="add1" href="javascript:;" class="easyui-linkbutton" data-options="iconCls:'icon-add',plain:true">帮人充值</a>
            </div>
        </div>

        <!-- 添加数据窗口 -->
        <div id="addDialog" style="padding: 10px">
            <form id="addForm" method="post">
                <table cellpadding="8">
                    <tr>
                        <td>卡号:</td>
                        <td><input id="cardNumber" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="cardNumber"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                    <tr>
                        <td>密码:</td>
                        <td><input id="password" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="password"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                    <tr>
                        <td>输入金额:</td>
                        <td><input id="money" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="money"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                </table>
            </form>
        </div>

        <div id="addDialog1" style="padding: 10px">
            <form id="addForm1" method="post">
                <table cellpadding="8">
                    <tr>
                        <td>手机号:</td>
                        <td><input id="phone" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="phone"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                    <tr>
                        <td>重复手机号:</td>
                        <td><input id="nextPhone" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="nextPhone"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                    <tr>
                        <td>卡号:</td>
                        <td><input id="cardNumber1" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="cardNumber"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                    <tr>
                        <td>密码:</td>
                        <td><input id="password1" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="password"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                    <tr>
                        <td>输入金额:</td>
                        <td><input id="money1" style="width: 200px; height: 30px;" class="easyui-textbox" type="text"
                                   name="money"
                                   data-options="required:true, validType:'repeat_course', missingMessage:'不能为空'"/></td>
                    </tr>
                </table>
            </form>
        </div>

        <div style="color: #FF0066" >
            <tr>
                <td>
                    <h1 align="center">感谢支持中国移动公司</h1>
                </td>
            </tr>
            <tr>
                <td>
                    <h1 align="center">客户的满意一直是我们最大的需求</h1>
                </td>
            </tr>
            <tr>
                <td>
                    <h1 align="center">客户的舒心是我们致力的服务</h1>
                </td>
            </tr>
        </div>
    </body>
</html>
